<!DOCTYPE>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <meta content="text/html; charset=utf-8" http-equiv="Content-Type"/>
    <title>用户管理</title>
    <link href="/css/style2.css" rel="stylesheet" type="text/css"/>
    <link href="/css/select.css" rel="stylesheet" type="text/css"/>
    <link href="/css/style.css" rel="stylesheet" type="text/css"/>
    <link href="/css/WdatePicker.css" rel="stylesheet" type="text/css"/>
    <link href="/css/skin_/form.css" rel="stylesheet" type="text/css"/>
    <link href="umeditor/themes/default/_css/umeditor.css" rel="stylesheet" type="text/css">
    <script src="/js/jquery.js" type="text/javascript"></script>
    <script src="/js/jquery.idTabs.min.js" type="text/javascript"></script>
    <script src="/js/select-ui.min.js" type="text/javascript"></script>

    <script src="/js/global.js" type="text/javascript"></script>
    <script src="/js/jquery.select.js" type="text/javascript"></script>
    <script src="/js/WdatePicker.js" type="text/javascript"></script>
    <script src="/js/umeditor.config.js" type="text/javascript"></script>
    <script src="/js/editor_api.js" type="text/javascript"></script>
    <script src="/js/umeditor/lang/zh-cn/zh-cn.js" type="text/javascript"></script>
    <script type="text/javascript">
        KE.show({
            id: 'content7',
            cssPath: './index.css'
        });
    </script>

    <script type="text/javascript">
        $(document).ready(function (e) {
            $(".select1").uedSelect({
                width: 345
            });
            $(".select2").uedSelect({
                width: 167
            });
            $(".select3").uedSelect({
                width: 100
            });
        });
    </script>
</head>

<body>

<div class="place">
    <span>位置：</span>
    <ul class="placeul">
        <li><a href="/report/reportSearch">日报管理</a></li>
    </ul>
</div>

<!--查询条件-->
<br/>
<br/>
<form id="search">
    <ul class="seachform">
        <li>
            <label> &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;姓名</label><input class="scinput" name="account"
                                                                               type="text"/></li>
        <li>
            <label> &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;开始日期</label><input class="scinput" name="beginDate"
                                                                                 onfocus="WdatePicker({dateFmt:'yyyy-MM-dd HH:mm:ss'})"
                                                                                 type="text"/>
        </li>
        <li>
            <label> &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;结束日期</label><input class="scinput" name="endDate"
                                                                                 onfocus="WdatePicker({dateFmt:'yyyy-MM-dd HH:mm:ss'})"
                                                                                 type="text"/>
        </li>

        <li><label>&nbsp;</label><input class="scbtn" name="" onclick="searchReport()" type="button" value="查询"/></li>

    </ul>
</form>
</div>

<div class="tools">

    <ul class="toolbar">
        <li class="click"><span><img src="/images/t01.png"/></span><a href="reportInsertView"
                                                                      target="_self">添加</a></li>
        <li class="click"><img src="/images/trash.png"/></span><a href="#" onclick="deleteAll()" target="_self">删除</a>
        </li>
    </ul>
</div>


<table class="tablelist">
    <tbody>
    <tr>
        <td>
            <table class="tablelist">
                <tbody>
                <tr>
                    <td>
                        <table class="tablelist">
                            <tbody>
                            <tr>
                                <td>
                                    <table class="tablelist">
                                        <thead>
                                        <tr>
                                            <th width="3%"><input id="checkAll" name="" onchange="checkAll()"
                                                                  type="checkbox"
                                                                  value=""/>
                                            </th>
                                            <th width="7%">工号<i class="sort"><img src="/images/px.gif"/></i>
                                            </th>
                                            <th width="11%">姓名</th>
                                            <th width="10%">日期</th>
                                            <th width="9%">作业进度</th>
                                            <th width="11%">作业内容</th>
                                            <th width="7%">问题点</th>
                                            <th width="8%">联络事项</th>
                                            <th width="13%">操作</th>
                                        </tr>
                                        </thead>
                                        <tbody id="tableContent">
                                        <tr th:each="p:${reports.content}">
                                            <td><input class="checkOne" name="" type="checkbox" value=""/></td>
                                            <td th:text="${p.reportId}">20130901</td>
                                            <td th:text="${p.account}">admin</td>
                                            <td th:text="${p.reportDate}">2013-09-09</td>
                                            <td th:text="${p.workProcess}">100%</td>
                                            <td th:text="${p.workContent}">登录模块详细设计</td>
                                            <td th:text="${p.problem}">&nbsp;</td>
                                            <td th:text="${p.tomorrowPlan}">&nbsp;</td>
                                            <td><span><a class="tablelink"
                                                         th:href="'reportUpdate?id='+${p.reportId}"><img
                                                    src="/images/user_edit.png"/>修改</a>
                                                <a class="tablelink" href="#" onclick="deleteOne(this)"
                                                   th:data="${p.reportId}">
                                                    <img src="/images/trash.png"/>删除</a></span></td>
                                        </tr>
                                        </tbody>
                                    </table>
                                </td>
                            </tr>
                            </tbody>
                        </table>
                    </td>
                </tr>
                </tbody>
            </table>
        </td>
    </tr>
    </tbody>
</table>


<div class="pagin">
    <div class="message">共<i class="blue" th:text="${reports.totalElements}">

    </i>条记录，当前显示第&nbsp;<i class="blue" th:text="${reports.number+1}+'&nbsp;'">2&nbsp;</i>页
    </div>
    <!--current more-->
    <ul class="paginList">
        <li class="paginItem">
            <a href="javascript:volid(0);" th:if="${reports.isFirst()}">
                <span class="pagepre"></span></a>

            <a th:href="'reportSearch?page='+${reports.number-1}" th:unless="${reports.isFirst()}">
                <span class="pagepre"></span></a>
        </li>

        <li th:class="${reports.number==i-1}?'paginItem current':'paginItem'"
            th:each="i:${#numbers.sequence(1,reports.totalPages)}">
            <a th:href="'reportSearch?page='+${i-1}" th:text="${i}">1</a></li>

        <li class="paginItem">
            <a href="javascript:volid(0);" th:if="${reports.isLast()}">
                <span class="pagenxt"></span></a>

            <a th:href="'reportSearch?page='+${reports.number+1}" th:unless="${reports.isLast()}">
                <span class="pagenxt"></span></a>
        </li>
    </ul>
</div>


<div class="tip">
    <div class="tiptop"><span>提示信息</span><a></a></div>

    <div class="tipinfo">
        <span><img src="images/ticon.png"/></span>
        <div class="tipright">
            <p>是否确认对信息的修改 ？</p>
            <cite>如果是请点击确定按钮 ，否则请点取消。</cite>
        </div>
    </div>

    <div class="tipbtn">
        <input class="sure" name="" type="button" value="确定"/>&nbsp;
        <input class="cancel" name="" type="button" value="取消"/>
    </div>

</div>


</div>

<script type="text/javascript">
    $('.tablelist tbody tr:odd').addClass('odd');
</script>
</body>
<script>
    function searchReport() {
        let str = $('#search').serializeArray()

        if (str[0].value == '' && str[1].value == '' && str[2].value == '') {
            alert('请至少完整输入一项查询条件！')
            return
        }
        if (str[1].value != '' && str[2].value == '') {
            alert('请输入结束日期')
            return
        }
        if (str[1].value == '' && str[2].value != '') {
            alert('请输入开始日期')
            return
        }

        $.ajax({
            url: 'reportSearchByNameAndDate',
            data: $('#search').serializeArray(),
            success: function (data) {
                console.log(data);
                let tr = ""
                for (let i = 0; i < data.length; i++) {
                    tr = tr + `<tr>
                    <td><input name="" type="checkbox" value=""/></td>
                    <td >${data[i].reportId}</td>
                    <td >${data[i].account}</td>
                    <td >${data[i].reportDate}</td>
                    <td>${data[i].workProcess}</td>
                    <td >${data[i].workContent}</td>
                    <td>${data[i].problem}</td>
                    <td>${data[i].tomorrowPlan}</td>
                    <td>
                    <span><a href="reportUpdate?id=${data[i].reportId}" className="tablelink"><img
                        src="/images/user_edit.png"/>修改</a> <a href="#"
                        data="${data[i].reportId}"
                                                               className="tablelink"
                                                               onClick="deleteOne(this)"> <img
                        src="/images/trash.png"/>删除</a></span></td>
                </tr>`
                }
                $(".pagin").hide()
                $("#tableContent").html(tr)
            }
        })
    }

    function deleteOne(target) {
        let boo = confirm("确定删除？");
        if (boo == false) {
            return
        }
        $.ajax({
            url: 'reportDelete',
            data: {
                id: target.getAttribute("data"),
            },
            success: function () {
                alert('删除成功！')
                location.reload()
            }
        })
    }

    function checkAll() {
        for (let i = 0; i < $(".checkOne").length; i++) {
            $(".checkOne")[i].checked = $("#checkAll")[0].checked
        }
    }


    function deleteAll() {
        let tr = $(".checkOne:checked").parent().parent().find('a:eq(1)')
        if (tr.length == 0) {
            alert('请选择删除的选项！')
            return
        }
        let boo = confirm("确定删除？");
        if (boo == false) {
            return
        }

        for (let i = 0; i < tr.length; i++) {
            $.ajax({
                url: 'reportDelete',
                data: {
                    id: tr[i].getAttribute("data"),
                },
                success: function () {
                    location.reload()
                }
            })
        }
        alert('删除成功！')
        location.reload()

    }
</script>
</html>
